<template>
  <div class="app">
    <p>温州理工学院滨海校区</p>
    <input type="text" v-model='StudentId'><button @click="find">搜索</button>

    <div v-if="StudentInfo.name">
      <p>姓名：{{StudentInfo.name}}</p>
      <p>年龄：{{StudentInfo.age}}</p>
      <p>性别：{{StudentInfo.gender}}</p>
      <p>年级：{{StudentInfo.grade}}</p>
      <p>班级：{{StudentInfo.class}}</p>
      <p>学院：{{StudentInfo.college}}</p>
      <p>专业：{{StudentInfo.major}}</p>
      <p>学号：{{StudentInfo.studentId}}</p>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      StudentId:'',
      StudentInfo:{}
    }
  },
  methods:{
    find(){
      this.StudentInfo = {name : '张三', age : 20, gender : '男',grade : '2019级',class : '1班',college : '计算机科学与技术学院',major : '计算机科学与技术',studentId : this.StudentId}
    }
  }
}
</script>

<style scoped lang="scss">
</style>